import { commonStyle, fontStyle } from './common.config';

export const list = [
  {
    type: 'list-image',
    name: '图片列表',
    eventList: '初始化事件',
    inputData: true,
    fieldList: '图片',
    dataList: [{"图片": "x"}],
    styleList: [
      {
        type: 'group',
        name: '图片设置',
        children: [
          {
            name: '显示多选框',
            fieldName: 'checkbox',
            fieldType: 'switch',
            default: false,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ]
          },
          {
            name: '多选框位置',
            fieldName: 'checkbox.position',
            fieldType: 'buttons',
            default: '左上',
            options: [
              {key: 'top:8px;left:8px;', value: '左上'},
              {key: 'bottom:8px;left:8px;', value: '左下'},
              {key: 'top:8px;right:8px;', value: '右上'},
              {key: 'bottom:8px;right:8px;', value: '右下'},
              {key: 'top:calc(50% - 7px);left:calc(50% - 7px);', value: '居中'},
            ],
            show: (data) => data['checkbox'] || false
          },
          {
            name: '最少选择数',
            fieldName: 'min-select',
            fieldType: 'number',
            default: 0,
            description: '最少选择的图片数量，为0时不限制',
            show: (data) => data['checkbox'] || false
          },
          {
            name: '最多选择数',
            fieldName: 'max-select',
            fieldType: 'number',
            default: 0,
            description: '最多选择的图片数量，为0时不限制',
            show: (data) => data['checkbox'] || false
          },
          {
            name: '宽度',
            fieldName: 'image.width',
            fieldType: 'input',
            default: '100px',
          },
          {
            name: '高度',
            fieldName: 'image.height',
            fieldType: 'input',
            default: '100px',
          },
          {
            name: '图片间隔',
            fieldName: 'gap',
            fieldType: 'input',
            default: '10px'
          },
          {
            name: '显示方式',
            fieldName: 'image.fit',
            fieldType: 'buttons',
            default: '',
            options: [
              {value: '填充', key: 'fill'},
              {value: '内容', key: 'contain'},
              {value: '裁剪', key: 'cover'},
              {value: '缩放', key: 'scale-down'},
              {value: '无', key: 'none'},
            ]
          }
        ]
      },
      ...commonStyle
    ]
  },
  {
    type: 'list-card',
    name: '卡片列表',
    height: '300px',
    eventList: '初始化事件,点击事件,点击标题事件',
    inputData: true,
    fieldList: '标题,数值',
    defaultStyle: {
      display: 'flex',
      "flex-direction": 'row',
      "justify-content": 'space-between',
    },
    styleList: [
      {
        type: 'group',
        name: '卡片设置',
        children: [
          {
            name: '卡片间隔',
            fieldName: 'gap',
            fieldType: 'input',
            default: '10px'
          },
          {
            name: '卡片样式',
            fieldName: 'styleList',
            fieldType: 'style-list',
            data: (data) => data,
            defaultStyle: {
              "background-color": '#409EFF',
              color: 'white',
              height: '100px',
              "justify-content": "center",
              "align-items": "center",
              "display": "flex",
              "flex-direction": "column",
              "radius-type": "simple",
              "border-radius": 10,
              "gap": "15px",
            },
            options: [
              {
                type: 'group',
                name: '条件设置',
                children: [
                  {
                    fieldName: 'conditionList',
                    fieldType: 'condition-list',
                  }
                ]
              },
              {
                type: 'group',
                name: '标题字体',
                children: [
                  ...fontStyle("title.")
                ]
              },
              {
                type: 'group',
                name: '数值字体',
                children: [
                  ...fontStyle("value."),
                  {
                    name: '是否显示',
                    fieldName: 'value.show',
                    fieldType: 'switch',
                    default: true,
                    options: [
                      {value: '', key: true},
                      {value: '', key: false}
                    ],
                  },
                ]
              },
              ...commonStyle
            ],
          }
        ]
      },
      ...commonStyle
    ]
  },
  {
    type: 'list-button',
    name: '按钮列表',
    defaultObject: true,
    eventList: '初始化事件,点击条目事件',
    inputData: true,
    fieldList: '显示字段,传值字段',
    fieldBuiltIn: true,
    defaultStyle: {
      display: 'flex',
      "flex-direction": 'row',
      "justify-content": 'flex-start',
      "height": "30px"
    },
    styleList: [
      {
        type: 'group',
        name: '通用设置',
        children: [
          {
            name: '显示全部',
            fieldName: 'showAll',
            fieldType: 'switch',
            default: true,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ],
          },
          {
            name: '全部名称',
            fieldName: 'allName',
            fieldType: 'input',
            default: '全部'
          },
          {
            name: '按钮间隔',
            fieldName: 'gap',
            fieldType: 'input',
            default: '10px'
          }
        ]
      },
      {
        type: 'group',
        name: '样式设置',
        children: [
          {
            name: '未选中样式',
            fieldName: 'styleList',
            fieldType: 'style-list',
            default: [
              {
                name: '未选中样式',
                fontColor: '#9C9C9C',
                height: '30px',
                padding: "0,20,0,20",
                "justify-content": "center",
                "align-items": "center",
                "display": "flex",
                "flex-direction": "column",
                "radius-type": "simple",
                "border-radius": 15,
                "border-type": "simple",
                "border-width": 1,
                "border-style": "solid",
                "border-color": "#9C9C9C"
              },
            ],
            defaultStyle: {
              fontColor: '#9C9C9C',
              height: '30px',
              padding: "0,20,0,20",
              "justify-content": "center",
              "align-items": "center",
              "display": "flex",
              "flex-direction": "column",
              "flex-shrink": "0",
              "radius-type": "simple",
              "border-radius": 15,
              "border-type": "simple",
              "border-width": 1,
              "border-style": "solid",
              "border-color": "#9C9C9C"
            },
            options: [
              {
                type: 'group',
                name: '样式名称',
                children: [
                  {
                    name: '名称',
                    fieldName: 'name',
                    fieldType: 'input',
                  }
                ]
              },
              {
                type: 'group',
                name: '条件设置',
                children: [
                  {
                    fieldName: 'conditionList',
                    fieldType: 'condition-list',
                  }
                ]
              },
              {
                type: 'group',
                name: '字体样式',
                children: [
                  ...fontStyle()
                ]
              },
              ...commonStyle
            ],
          },
          {
            name: '已选中样式',
            fieldName: 'selected.styleList',
            fieldType: 'style-list',
            default: [
              {
                name: '已选中样式',
                "fontColor": 'white',
                height: '30px',
                padding: "0,20,0,20",
                "justify-content": "center",
                "align-items": "center",
                "display": "flex",
                "flex-direction": "column",
                "flex-shrink": "0",
                "radius-type": "simple",
                "border-radius": 15,
                "bgMode": "颜色",
                "background-color": "#409EFF",
                "border-type": "simple",
                "border-width": 1,
                "border-style": "solid",
                "border-color": "#409EFF"
              },
            ],
            defaultStyle: {
              "fontColor": 'white',
              height: '30px',
              padding: "0,20,0,20",
              "justify-content": "center",
              "align-items": "center",
              "display": "flex",
              "flex-direction": "column",
              "flex-shrink": "0",
              "radius-type": "simple",
              "border-radius": 15,
              "bgMode": "颜色",
              "background-color": "#409EFF",
              "border-type": "simple",
              "border-width": 1,
              "border-style": "solid",
              "border-color": "#409EFF"
            },
            options: [
              {
                type: 'group',
                name: '样式名称',
                children: [
                  {
                    name: '名称',
                    fieldName: 'name',
                    fieldType: 'input',
                  }
                ]
              },
              {
                type: 'group',
                name: '条件设置',
                children: [
                  {
                    fieldName: 'conditionList',
                    fieldType: 'condition-list',
                  }
                ]
              },
              {
                type: 'group',
                name: '字体样式',
                children: [
                  ...fontStyle()
                ]
              },
              ...commonStyle
            ],
          }
        ]
      },
    ]
  },
  {
    type: 'data-table',
    name: '数据表格',
    eventList: '初始化事件,点击更多事件,点击条目事件',
    inputData: true,
    fieldList: '标题,日期',
    defaultStyle: {
      display: 'flex',
      "flex-direction": 'column',
      "justify-content": 'flex-start',
      "align-items": 'flex-start',
    },
    styleList: [
      {
        type: 'group',
        name: '基础设置',
        children: [
          {
            name: '宽度',
            fieldName: 'width',
            fieldType: 'input',
            default: '100%',
          },
          {
            name: '高度',
            fieldName: 'height',
            fieldType: 'input',
            default: '100%',
          },
          {
            name: '垂直边框',
            fieldName: 'border',
            fieldType: 'switch',
            default: false,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ],
          },
          {
            name: '斑马纹',
            fieldName: 'stripe',
            fieldType: 'switch',
            default: false,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ],
          }
        ]
      },
      {
        type: 'group',
        name: '表头设置',
        children: [
          {
            name: '字体颜色',
            fieldName: 'header.color',
            fieldType: 'color-picker',
            default: '#333333',
          },
          {
            name: '字体大小',
            fieldName: 'header.fontSize',
            fieldType: 'number',
            default: 14,
          },
          {
            name: '字体加粗',
            fieldName: 'header.fontWeight',
            fieldType: 'select',
            default: 'normal',
            allowCreate: true,
            options: [
              {value: 'normal', key: 'normal'},
              {value: 'bold', key: 'bold'},
              {value: 'bolder', key: 'bolder'},
              {value: 'lighter', key: 'lighter'},
            ],
          },
          {
            name: '背景颜色',
            fieldName: 'header.bgColor',
            fieldType: 'color-picker',
            default: '#d5ecff',
          },
          {
            name: '边框颜色',
            fieldName: 'header.borderColor',
            fieldType: 'color-picker',
          },
          {
            name: '字体边距',
            fieldName: 'header.padding',
            fieldType: 'multiple-number',
            number: 4,
            default: '10,5,10,5',
            description: '上,右,下,左'
          },
          {
            name: '显示多选框',
            fieldName: 'header.checkbox',
            fieldType: 'switch',
            default: false,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ]
          },
          {
            name: '显示序号',
            fieldName: 'header.index',
            fieldType: 'switch',
            default: false,
            options: [
              {value: '', key: true},
              {value: '', key: false}
            ]
          }
        ]
      },
      {
        type: 'group',
        name: '列设置',
        children: [
          {
            name: '列设置',
            fieldName: 'columnList',
            fieldType: 'style-list',
            default: [{
              label: '标题',
              prop: '标题',
              fieldType: '字符',
              width: 100,
              autoWidth: true,
              headerAlign: 'center',
              align: 'center'
            },{
              label: '日期',
              prop: '日期',
              fieldType: '日期',
              format: 'yyyy-MM-dd',
              width: 120,
              headerAlign: 'center',
              align: 'center'
            }],
            defaultStyle: {
              lineHeight: ''
            },
            options: [
              {
                type: 'group',
                name: '列设置',
                children: [
                  {
                    name: '列名称',
                    fieldName: 'label',
                    fieldType: 'input',
                  },
                  {
                    name: '显示内容',
                    fieldName: 'prop',
                    fieldType: 'select',
                    optionsFieldList: true
                  },
                  {
                    name: '内容类型',
                    fieldName: 'fieldType',
                    fieldType: 'select',
                    default: '字符',
                    options: "字符,字典,数字,日期,图片,视频"
                  },
                  {
                    name: '自动换行',
                    fieldName: 'wrap',
                    fieldType: 'switch',
                    default: true,
                    options: [
                      {value: '', key: true},
                      {value: '', key: false}
                    ],
                  },
                  {
                    name: '数据字典',
                    fieldName: 'dictCode',
                    fieldType: 'dict-tree',
                    show: (data) => data['fieldType'] === '字典'
                  },
                  {
                    name: '保留位数',
                    fieldName: 'point',
                    fieldType: 'number',
                    show: (data) => data['fieldType'] === '数字'
                  },
                  {
                    name: '格式化',
                    fieldName: 'format',
                    fieldType: 'select',
                    allowCreate: true,
                    options: 'yyyy-MM-dd,yyyy-MM-dd HH,yyyy-MM-dd HH:mm:ss',
                    show: (data) => data['fieldType'] === '日期'
                  },
                  {
                    name: '列宽度',
                    fieldName: 'width',
                    fieldType: 'number',
                    default: 100,
                  },
                  {
                    name: '自动列宽',
                    fieldName: 'autoWidth',
                    fieldType: 'switch',
                    default: false,
                    options: [
                      {value: '', key: true},
                      {value: '', key: false}
                    ],
                  },
                  {
                    name: '开启排序',
                    fieldName: 'sortable',
                    fieldType: 'switch',
                    default: false,
                    options: [
                      {value: '', key: true},
                      {value: '', key: false}
                    ],
                  },
                  {
                    name: '列头布局',
                    fieldName: 'headerAlign',
                    fieldType: 'select',
                    default: 'center',
                    options: [
                      {value: '居左', key: 'left'},
                      {value: '居中', key: 'center'},
                      {value: '居右', key: 'right'}
                    ]
                  },
                  {
                    name: '内容布局',
                    fieldName: 'align',
                    fieldType: 'select',
                    default: 'center',
                    options: [
                      {value: '居左', key: 'left'},
                      {value: '居中', key: 'center'},
                      {value: '居右', key: 'right'}
                    ]
                  }
                ]
              },
              {
                type: 'group',
                name: '字体样式',
                children: [
                  ...fontStyle()
                ]
              },
            ],
          },
        ]
      },
    ]
  },
  {
    type: 'list-custom',
    name: '自定义列表',
    eventList: '点击条目事件',
    inputData: true,
    scene: '相对,绝对,应用',
    styleList: [
      {
        type: 'group',
        name: '基础设置',
        children: [
          {
            name: '无数据提示',
            fieldName: 'empty-tips',
            fieldType: 'input',
            default: '无符合条件的数据',
          }
        ]
      }
    ]
  }
]